<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<script src="js/objx-2.3.6.js" type="text/javascript"></script>
		<script src="js/jquery-1.11.1.min.js"></script>
		<script type="text/javascript" src="js/notify.js"></script>
		<link rel="stylesheet" href="js/sticky.css" type="textcss" />
		<script type="text/javascript" src="css/sticky.js"></script>
		<script src="js/jquery-ui-1.10.4.js"></script>
		<link rel="stylesheet" href="css/jquery-ui-1.10.4.css">
		<script type="text/javascript" src="js/functions.js"></script>
		<script type="text/javascript" src="js/employee.js"></script>
		<script type="text/javascript" src="js/time.js"></script>
		<script type="text/javascript" src="js/inventory.js"></script>
		<script type="text/javascript" src="js/orders.js"></script>
		<script type="text/javascript" src="js/event.js"></script>
		
		
		<script>
			$(function() {
				$("#tabs").tabs();
			});
		</script>
	</head>

	<body onload="init()">
		<h4 align="center">Welcome to Sandwich Tycoon</h4>

		<div id="tabs">
			<ul>
				<li>
					<a href="#tabs-1">Main</a>
				</li>
				<li>
					<a href="#tabs-2">Employees</a>
				</li>
				<li>
					<a href="#tabs-3">Inventory</a>
				</li>

				<li>
					<a href="#tabs-4">Debug</a>

				</li>

			</ul>
			<div id="tabs-1">
				<div>
					<h4>Money</h4>
					<input id="money" readonly=""  value="$100"/>
				</div>

				<div align="top">
					<h4>Active Events</h4>
					<textarea id="eventtextarea"  style = "width:500px;height:200px" rows="10" col="50"></textarea>
				</div>
			</div>
			<div id="tabs-2">
				<br/>
                <br>
                <table id="employeetable">
                    <tr>
                        <td>Select Employee</td>
                        <td><select id="emplyselect" onchange="updateemployeeform()" ></select></td>
                    </tr>
                    <tr>
                        <td>Name</td>
                        <td><input id="name" readonly=""  value=""/></td>
                    </tr>
                    <tr>

                        <td>Loyalty</td>
                        <td><input id="loyalty" readonly=""  value=""/></td>
                    </tr>
                    <tr>
                        <td>Efficiency</td>
                        <td><input id="efficiency" readonly=""  value=""/></td>
                    </tr>
                    <br>
                    <tr>
                        <td colspan="2" align="center"><button id="hirebutton" onclick="hireEmployee()">Hire</button></td>
                    </tr>
                </table>
                <br>
                <br>
                  <table>
                    <tr>
                        <td>Employee Wage</td>
                        <td><INPUT id="employeewage" oninput="wagechange()" TYPE="NUMBER" MIN="5.0" MAX="20" STEP=".25" VALUE="1" ></td>
                    </tr>
                    <tr>
                        <td>Number of Employees</td>
                        <td><input id="numemployee" readonly=""  value="" size="7"/></td>
                    </tr>
                </table>
			</div>
			<div id="tabs-3">
				<h4>Select Supplier</h4>
				<select id="supselect" onchange="selectchange()"></select>
				<br/>
				<h4>Menu Items</h4>
				<select id="menuselect" onclick="menuchange()" size="5" multiple=""></select>
				<!--<button>&gt;</button>
				<button>&lt;</button> -->
				<select id="currentmenu" onclick="menuremove()" size="5" multiple=""></select>
				<br/>
			</div>

			<div id="tabs-4">
				<br />
				<textarea id="textarea"  style = "width:500px;height:200px" rows="10" col="50"></textarea>
				<br />
				<h4 >Hours in a day</h4>
				<INPUT id="hoursinday" oninput="changeDayLength()" TYPE="NUMBER" MIN="1" MAX="12" STEP="1" VALUE="8" SIZE="10">
				<br />
				<h4 >Time Multiplier</h4>
				<INPUT id="timemultiplier" oninput="setTimeMultiplier()" TYPE="NUMBER" MIN="1" MAX="10" STEP="1" VALUE="1" SIZE="10">
				<br />
				<br />
				<button id="timetoggle" onclick="toggleTime()">
					Toggle Time
				</button>
				<input id="time" readonly=""  value="Clock is on"/>
			</div>
		</div>
	</body>
</html>
